<template>
  <div>
    <div class="return">
      <van-icon @click="returnTap" class="icon" name="arrow-left" style="color: #fff;font-size:18px" v-if="mode !=4" />
      <span v-text="txt" style="color: #fff;font-size:18px"></span>
      <van-icon name="ellipsis" class="ellipsis" v-if="mode ==1" @click="btnMore"/>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {};
  },
  methods: {
      returnTap(){
            this.$router.go(-1);
      },
      btnMore(){
        this.$emit('showMode')
      }
  },
  props: {
    txt: {
      type: String,
    },
    mode:{
      type:Number,
      default:0
    }
  },
};
</script>
<style scoped>
.return {
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  width: 94%;
  padding-left: 3%;
  padding-right: 3%;
  position: relative;
  background: #4ac7d7;
}
.icon{
    position: absolute;
    left:1%;
    top: 20px;
    color: white;
}
.ellipsis{
  position: absolute;
  right: 1%;
  top: 20px;
  color: #fff;
  font-size:18px;
}
</style>